<template>
    <div class="hospital">

        <!-- 左侧导航区域 -->
        <div class="menu">
            <div class="top">
                <el-icon>
                    <House />
                </el-icon>
                <span> / 会员中心</span>
            </div>
            <!--  :router="true "
              @click="changeActive('/hospital/register')"
        -->
            <el-menu :default-active="$route.path" class="el-menu-vertical-demo" :router="true">
                <el-menu-item index="/user/certification"
                    :route="{ path: '/user/certification', query: { hoscode: $route.query.hoscode } }">
                    <el-icon>
                        <Postcard />
                    </el-icon>
                    <span>实名认证</span>
                </el-menu-item>
                <el-menu-item index="/user/order"
                    :route="{ path: '/user/order', query: { hoscode: $route.query.hoscode } }">
                    <el-icon>
                        <Memo />
                    </el-icon>
                    <span>挂号订单</span>
                </el-menu-item>
                <el-menu-item index="/user/patient"
                    :route="{ path: '/user/patient', query: { hoscode: $route.query.hoscode } }">
                    <el-icon>
                        <User />
                    </el-icon>
                    <span>就诊人管理</span>
                </el-menu-item>
                <el-menu-item index="/user/profile"
                    :route="{ path: '/user/profile', query: { hoscode: $route.query.hoscode } }">
                    <el-icon>
                        <Document />
                    </el-icon>
                    <span>账号信息</span>
                </el-menu-item>
                <el-menu-item index="/user/feedback"
                    :route="{ path: '/user/feedback', query: { hoscode: $route.query.hoscode } }">
                    <el-icon>
                        <ChatDotRound />
                    </el-icon>
                    <span>意见反馈</span>
                </el-menu-item>
            </el-menu>
        </div>
        <!-- 右侧内容展示区域：路由组件展示位置 -->
        <div class="content">
            <!-- 子组件展示区域 -->
            <!-- 添加路由标签 -->
            <router-view></router-view>
        </div>
    </div>
</template>
<script setup lang="ts">
import { onMounted } from 'vue';
import useDetailStore from '../../store/modules/hospitalDetail';
// 获取仓库对象
let detailStore = useDetailStore();
import {
    Document,
        House,
    Postcard,
    Memo,
    User,
    ChatDotRound
} from '@element-plus/icons-vue'

import { useRoute } from "vue-router";
// 获取当前路由的信息
let $route = useRoute();
// 组件挂载完毕：通知pinia仓库发送请求获取医院详情数据，存储在仓库当中
onMounted(() => {
    // // 获取医院详情的数据
    // detailStore.getHospital($route.query.hoscode as string);
    // // 获取某一个医院科室的数据
    // detailStore.getDeparment($route.query.hoscode as string);
})
</script>

<style lang="scss">
.hospital {
    display: flex;

    .menu {
        flex: 3;
        display: flex;
        flex-direction: column;
        align-items: center;

        .top {
            color: #a7abb7;
        }
    }

    .content {
        flex: 17
    }
}</style>